<!DOCTYPE html>
<html>

<head>
    <meta charset="utf-8">
    <meta name="viewport" content="initial-scale=1, maximum-scale=1, user-scalable=no">
    <meta name="format-detection" content="telephone=no">
    <title>留言预约</title>
    <link rel="stylesheet" href="../css/frozen.css">
    <link rel="stylesheet" href="../css/public.css">
    <script src="../lib/zepto.min.js"></script>
    <script src="../js/frozen.js"></script>
    <style type="text/css">
    .ui-list-info .ui-teacher-name{color: #333;}
    .ui-teacherAd .ui-avatar{width:60px;height:60px;}
    .ui-teacherAd,.demo-massage{margin:10px;background: #fff}
    .ui-txt-right span{float: right;margin-left: 8px;}
    .ui-user-city input{padding:0;}
    .ui-user-city .ui-huWd{width:70px;}
    .ui-user-city .ui-eiWd{width: 56px;}
    .ui-masssage-cont{display: block;width: 100%;resize:none;border-radius: 2px;border-radius: 2px;height: 200px;overflow-y: scroll;margin-bottom: 20px;
        text-indent: 1em;line-height: 30px;color: #999;}
    </style>
</head>

<body ontouchstart>
    <section class="ui-container">
        <div class="demo-item ui-teacherAd">
            <ul class="ui-list">
                <li>
                    <div class="ui-avatar">
                        <span style="background-image:url(http://placeholder.qiniudn.com/100x100)"></span>
                    </div>
                    <div class="ui-list-info">
                        <h4 class="ui-nowrap">远程：高数老不回怎么办，点击看看</h4>
                        <p class="ui-nowrap ui-teacher-name"><span>OIHIOD</span><span class="teacher-honour">北京大学博士</span></p>
                        <p class="ui-nowrap ui-txt-right">652484约见<span>约1小时</span><span>￥300</span></p>
                    </div>
                </li>
            </ul>
        </div>
        <div class="demo-block">
            <div class="ui-form ui-border-t">
                <form action="#">
                    <div class="ui-form-item ui-border-b">
                        <label class="ui-border-r">
                            姓名：
                        </label>
                        <input type="text" id="realname" placeholder="输入您的姓名" />
                    </div>
                    <div class="ui-form-item ui-border-b">
                        <label class="ui-border-r">
                            手机号：
                        </label>
                        <input type="text" id="mobile" placeholder="输入您的手机号" />
                    </div>
                    <div class="ui-form-item ui-border-b ui-user-city">
                        <span class="ui-border-r">
                            城市：
                        </span>
                        <input type="text" id="province" class="ui-huWd"/>
                         <span class="ui-border-r">
                            省：
                        </span>
                        <input type="text" id="city" class="ui-eiWd"/>
                         <span class="ui-border-r">
                            市：
                        </span>
                    </div>
                </form>
            </div>
        </div>
        <div class="demo-massage">
            <textarea class="ui-masssage-cont">请在500字以内 描述你想咨询的问题</textarea>
            <button class="ui-btn-lg ui-btn-primary" id="btnApply">提交</button>
        </div>
    </section>
    
    <!-- /.ui-container-->
    <script>
    $('.ui-list li,.ui-tiled li').click(function() {
        if ($(this).data('href')) {
            location.href = $(this).data('href');
        }
    });

    Zepto(function($) {
        //轮播
        $("#btn1").click(function(){
            $(".ui-dialog").dialog("show");
        });
        //问题输入
        $(".ui-masssage-cont").click(function(){
            if($(this).html()=="请在500字以内 描述你想咨询的问题"){
                $(this).html("");
            };
        })

        var params = {"cartInfos":[{"productId":BWK.UrlParams.id,"count":1}],"message":$(".ui-masssage-cont").val()};
        
        $('#btnApply').click(function(){
            //预约购买商品
            BWK.api.lesson.lessonProdectBuy(params,function(data){

                var usereParams = [];
                
                $('form input').each(function(){
                    if($(this).val()){
                        usereParams.push({"name":$(this).attr('id'),"value":$(this).val()});
                    }
                });

                BWK.api.user.updateUser(usereParams,function(data){
                    
                    
                
                });

            });
        });
        
        
    });

    function _dealImgList(obj) {



    }
    </script>
</body>

</html>
